<!-- Teacher_StudyCourseMaterials.html -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
	<title>MOOC课程资料</title>
	<link rel="stylesheet" type="text/css" href="../../css/api.css" />
	<link rel="stylesheet" type="text/css" href="../../css/weui.min.css" />
	<link rel="stylesheet" href="../../css/mui.min.css" />
	<link rel="stylesheet" href="../../css/base.css"/>
	<link rel="stylesheet" href="../../css/CFNetPP_Base.css">
	<style type="text/css" media="screen">
		.feeling{
			padding: 10px;
			margin-top: 10px;
		}
		.feeling-text{
			word-break: break-all;
		}
		.mui-table-view-cell>a:not(.mui-btn){
			padding-left: 4px;
		}
		.mui-table-view .mui-media-object.mui-pull-left{
			margin-right: 4px;
		}
		.message_title{
			width: 100%;
		}
		.mui-table-view-cell p{
			height: 24px;
		}
		.file_size{
			margin-left: 40px;
		}
		.download_img{
			width: 20px;
			margin-bottom: 4px;
		}
		.download_progress{
			background-color: rgba(24,180,237,0.25);
			height:100%;
			width:0;
			position:absolute;
			left: 0;
			top:0;
		}
	</style>
</head>
<body>
	<ul id="file_list" class="mui-table-view">
		<!-- <li class="mui-table-view-cell mui-media">
			<div class="download_progress" style="width:50%;"></div>
			<a href="javascript:;">
				<img class="mui-media-object mui-pull-left" style="padding: 6px;" src="../../image/icon_wenjia01.png" >
				<div class="mui-media-body">
					<p class="mui-ellipsis base_dark_grey font14">
						<span class="message_title">
							超长文件名超长文件名超长文件名超长文件名超长文件名超长文件名超长文件名超长文件名超长文件名超长文件名超长文件名超长文件名超长文件名超长文件名
						</span>  
					</p>
					<p class='mui-ellipsis base_light_gray font12 content_p'>
						<span class="message_content">
							<span class="file_submit_time">
								2017-01-02 14:20
							</span>
							<span class="file_size">
								1.5MB
							</span>
						</span>
						<img src="../../image/iconO_xiazai.png" alt="" class="download_img">
					</p>
				</div>
			</a>
		</li> -->
	</ul>
    <div class="noSign"  id="noData"  hidden="hidden">
		<img src="../../image/icon_img.png" width="60%">
		<p class="font16 top_15 base_dark_grey" >
			暂无资料
		</p>
	</div>
	<div class="loadFailure" hidden="hidden" id="noNet">
		<img src="../../image/icon_img01.png" width="60%">
		<p class="" >
			数据加载失败
		</p>
		<p>
			请检查您的网络
		</p>
		<button type="button" class="mui-btn mui-btn-outlined" onclick="RefreshData()">
			重新加载
		</button>
	</div>
</body>
<script src="../../script/jquery.min.js"></script>
<script src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/MD5.js"></script>
<script type="text/javascript" src="../../script/requestTool.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script type="text/javascript" src="../../script/attachmentManager.js"></script>
<script type="text/javascript" src="../../script/timeStampTool.js"></script>
<script type="text/javascript" src="../../script/getToken.js"></script>
<script type="text/javascript">
	apiready = function(){
		SendBehaviorTrajectoriesNotifi('0', 'mooc资料', '027');
	    loadData();
	    setupNotifi();
	}
	function loadData(){
		api.showProgress({
		    style: 'default',
		    animationType: 'fade',
		    title: '加载中...',
		    text: '',
		    modal: false
		});
		var param = {
			cid : api.pageParam.courseid
			// cid : 10332
		};
		// console.log('url:'+url_moocMateriaList+'\n'+JSON.stringify(param));
		cfnetppPOST(url_moocMateriaList,
		param,
		true,
		function(data, status){
			api.hideProgress();
			if (status == 'success') {
				if (data.status == true && data.code == 200) {
					var folderFiles = data.data;
					if (folderFiles != null && folderFiles.constructor == Array && folderFiles.length > 0) {
						$('.noSign').hide();
		    			$('.loadFailure').hide();
						setupFilesHtml(folderFiles);
					}else{
						$('.noSign').show();
		    			$('.loadFailure').hide();
					}
				}else{
					$('.noSign').show();
	    			$('.loadFailure').hide();
				}
			}else{
				$('.noSign').hide();
    			$('.loadFailure').show();
			}
		});
	}
	//设置文件列表
	function setupFilesHtml(files){
		var filesHtmlString = '';
		for (var i = 0; i < files.length; i++) {
			var fileData = files[i];
			// var filePath = fileData.realurl;
			// var fileid = fileData.id;
			// var filename = filePath.substr(filePath.lastIndexOf('\/')+1);
			// var filename = fileData.names;
			// fileData["fileid"] = fileid;
			// fileData["filename"] = filename;
			filesHtmlString += fileHtmlString(fileData);
		}
		$('#file_list').html(filesHtmlString);
		setupFileStatus(files);
		setupFileClick();
	}
	function setupFileStatus(datas){
		for (var i = 0; i < datas.length; i++) {
			var fileData = datas[i];
			var fileid = fileData.id;
			var filePath = api.cacheDir + '/freeCourseFile/' + fileid + '/' + fileData.names;
			setupStatus(fileid, filePath);
		}
	}
	function setupStatus(fileid, filePath){
		var fs = api.require('fs');
		fs.exist({
		    path: filePath
		}, function(ret, err) {
		    if (ret.exist) {//存在
		        //ret.directory==true文件夹否为文件
		        $('#' + fileid).removeClass('isNotDownload');
		        $('#' + fileid).addClass('isDownload');
		        $('#' + fileid).hide();
		    } else {//不存在
		    	$('#' + fileid).removeClass('isDownload');
		        $('#' + fileid).addClass('isNotDownload');
		        $('#' + fileid).attr('src', '../../image/iconO_xiazai.png');
		        $('#' + fileid).show();
		    }
		});
	}
	function fileHtmlString(data){
		return '<li file_id="'+data.id+'" class="mui-table-view-cell mui-media folder_file_cell" file_name="'+data.names+'" file_path="'+data.realurl+'" is_encr="'+data.is_encr+'" baidu_cloud_id="'+data.baidu_cloud_id+'" baidu_cloud_id_url="'+data.baidu_cloud_id_url+'">'+
				'<div id="progress'+data.id+'" class="download_progress"></div>'+
				'<a href="javascript:;">'+
					'<img class="mui-media-object mui-pull-left" style="padding: 6px;" src="../../image/icon_wenjia01.png" >'+
					'<div class="mui-media-body">'+
						'<p class="mui-ellipsis base_dark_grey font14">'+
							'<span class="message_title">'+
								data.names+
							'</span>'+  
						'</p>'+
						'<p class="mui-ellipsis base_light_gray font12 content_p">'+
							'<span class="message_content">'+
								'<span class="file_submit_time">'+
									timeWithStamp(data.ctime.toString())+
								'</span>'+
								'<span class="file_size">'+
									bytesToSize(data.size)+
								'</span>'+
							'</span>'+
							'<img id="'+data.id+'" src="../../image/iconO_xiazai.png" alt="" class="download_img" file_name="'+data.names+'" file_path="'+data.realurl+'" hidden="hidden">'+
						'</p>'+
					'</div>'+
				'</a>'+
			'</li>';
	}
	function setupFileClick(){
		$('.folder_file_cell').unbind('click');
		$('.folder_file_cell').click(function(){
			var doc = $(this).attr('file_path');
			doc = fullPathWithUrl(doc);
			var title = $(this).attr('file_name');
			var fileid = $(this).attr('file_id');
			var is_encr = $(this).attr('is_encr');
			var baidu_cloud_id = $(this).attr('baidu_cloud_id');
			var baidu_cloud_id_url = $(this).attr('baidu_cloud_id_url');
			if ($('#'+fileid).hasClass('isDownload')) {
				openLocalFile(api.cacheDir + '/freeCourseFile/' + fileid + '/' + title);
			}else{
				var arr = new Array('jpg', 'gif', 'png', 'jpeg', 'bmp');
				var arr1 = new Array('swf', 'mp4');
				var ext = doc.replace(/.+\./, "");
				
				if (arr.toString().indexOf(ext) > -1) {
					openImage(doc);
				} else {
					if (arr1.toString().indexOf(ext) > -1) {
						var patt1 = new RegExp("http://");
			            if (!patt1.test(doc)){//如果为本地缓存文件直接播放
			                pushToBaiDuPlayer(is_encr, baidu_cloud_id_url, doc, title);
			                return;
			            }
						var connectionType = api.connectionType;
			            if (connectionType != 'wifi' && connectionType != 'none') {
			            	api.confirm({
			                    title: '提示',
			                    msg: '您当前处于移动数据网络下，是否继续播放',
			                    buttons: ['确定', '取消']
			                }, function(ret, err) {
			                    var index = ret.buttonIndex;
			                    if (index == 1) {//确定
			                        pushToBaiDuPlayer(is_encr, baidu_cloud_id_url, doc, title);
			                    }
			                });
			            }else{
			            	pushToBaiDuPlayer(is_encr, baidu_cloud_id_url, doc, title);
			            }
					} else {
						api.openWin({useWKWebView:true,
							name : 'Student_FreeCourseDoc',
							url : '../Study/Student_FreeCourseDoc.html',
							pageParam : {
								title : title,
								doc : doc
							}
						});
					}
				}
			}
		});
		$('.download_img').unbind('click');
		$('.download_img').click(function(event){
			var fileid = $(this).attr('id');
			var filename = $(this).attr('file_name');
			var fileurl = $(this).attr('file_path');
			if($(this).hasClass('isNotDownload')){//未下载
				//判断当前网络
	            var connectionType = api.connectionType;
	            if (connectionType != 'wifi' && connectionType != 'none') {
	            	api.confirm({
	                    title: '提示',
	                    msg: '您当前处于移动数据网络下，是否继续下载',
	                    buttons: ['确定', '取消']
	                }, function(ret, err) {
	                    var index = ret.buttonIndex;
	                    if (index == 1) {//确定
	                        api.sendEvent({
							    name: 'startDownloadFileNotifi',
							    extra: {
							        fileid : fileid,
									filename : filename,
									fileurl : fileurl
							    }
							});
	                    }
	                });
	            }else{
	            	api.sendEvent({
					    name: 'startDownloadFileNotifi',
					    extra: {
					        fileid : fileid,
							filename : filename,
							fileurl : fileurl
					    }
					});
	            }
			}
			//停止事件传递
			event.stopPropagation();
		});
	}
	function fullPathWithUrl(fileUrl){
		if(fileUrl != null && fileUrl != '' && fileUrl.indexOf("http://") < 0 ){
			fileUrl = 'http://bos.cfnet.org.cn' + fileUrl;
		} 
		return fileUrl;
	}
	function pushToBaiDuPlayer(is_encr, baidu_cloud_id_url, path, title){
		if (api.connectionType == 'none') {//暂无网络
 			api.toast({
 			    msg: '暂无网络，无法访问该资源'
 			});
 			return;
 		}
		var videoPath = fullPathWithUrl(path);
		if (is_encr == 1 || is_encr == 2) {//加密
			videoPath = baidu_cloud_id_url;
			getVideoToken(function(status, videoToken){
				api.openWin({useWKWebView:true,
		 		    name: 'BaiDuWebVideo',
		 		    url: '../Study/BaiDuWebVideo.html',
		 		    pageParam: {
		 		    	title: title,
		 		        url: videoPath,
		 		        token: videoToken
		 		    },
		 		    slidBackEnabled: false
		 		});
	        });
		}else{
			api.openWin({useWKWebView:true,
	 		    name: 'BaiDuWebVideo',
	 		    url: '../Study/BaiDuWebVideo.html',
	 		    pageParam: {
	 		    	title: title,
	 		        url: videoPath,
	 		        token: ''
	 		    },
	 		    slidBackEnabled: false
	 		});
		}
	}
	function playVideo(path, title){
		var h = 240;
		api.openFrame({
		    name: 'HTML5VideoPlayer',
		    url: '../Teacher_Teach/HTML5VideoPlayer.html',
		    rect: {
		        x: 0,
		        y: 0,
		        w: 'auto',
		        h: h
		    },
		    pageParam:{
		    	videoUrl : path
		    },
		    reload : true
		});
		return;
		var videoPlayer = api.require('videoPlayer');
		videoPlayer.play({
		    path : path,
		    texts: {
		        head: {
		            title: title
		        }
		    },
		    styles : {
		    	head : {
		    		backSize : 24,
		    		backImg : 'widget://image/vp_back.png',
		    		setSize : 24,
		    		setImg : 'widget://image/vp_more.png'
		    	},
		    	foot :{
		    		playSize : 24,
		    		playImg : 'widget://image/vp_play.png',
		    		pauseImg : 'widget://image/vp_pause.png',
		    		nextSize : 24,
		    		nextImg : 'widget://image/vp_next.png'
		    	}
		    }
		}, function(ret, err) {
		});
	}
	function setupNotifi(){
		api.addEventListener({
		    name: 'downloadFreeCourseFileNotifi'
		}, function(ret, err) {
			// console.log(JSON.stringify(ret));
			var notifiValue = ret.value;
		    var fileId = notifiValue.fileid;
		    var notifiRet = notifiValue.ret;
		    var width = "width:" + notifiRet.percent + "%;";
		    // console.log(fileId+'\n'+width);
		    $('#progress' + fileId).attr('style', width);
		    if(notifiRet.state == 1){//下载完成
		    	$('#progress' + fileId).attr('style', 'width(0)');
		    	$('#' + fileId).removeClass('isNotDownload');
		        $('#' + fileId).addClass('isDownload');
		        $('#' + fileId).hide();
		    }else if(notifiRet.state == 2){//下载失败
		    	$('#progress' + fileId).attr('style', 'width(0)');
		    	$('#' + fileId).removeClass('isDownload');
		        $('#' + fileId).addClass('isNotDownload');
		        $('#' + fileId).attr('src', '../../image/iconO_xiazai.png');
		        $('#' + fileId).show();
		    }
		});
	}
	function RefreshData(){
		loadData();
	} 
</script>
</html>
